<template>
  <layout class="layout-100" v-if="model">
    <Header class="header-cont">审批配置</Header>
    <Content class="content-cont">
      <Form ref="formData" :model="formData" label-position="top">
        <Row>
          <Col span="24">
          <FormItem label="审批人" :required="true">
            <Row v-for="(item,index) in approvalPerson">
              <Input style="width:350px;" placeholder="请选择"  @on-focus="checkPerson(index,1)" v-model.trim="item.name" readonly/>
              <Icon
                style="margin-top:20px;"
                type="ios-add-circle-outline"
                size="20"
                color="#0099FF"
                @click="addPerson"
              />
              <Icon
                type="ios-remove-circle-outline"
                @click="remove(index)"
                size="20"
                v-show="index !=0"
                color="#999999"
              />
            </Row>
          </FormItem>
          </Col>
          <Col span="24">
          <FormItem label="签发人" :required="true">
            <Input style="width:350px;" placeholder="请选择"  @on-focus="checkPerson(index,2)" v-model.trim="approvalPerson2.name" readonly/>
          </FormItem>
          </Col>
        </Row>
      </Form>

    </Content>
    <Footer class="footer-cont">
      <Button type="primary" @click="saveSubmit()">保存</Button>
      <Button @click="closetab">取消</Button>
    </Footer>
  </layout>
  <checkPersonModal @func="getMsg" v-else-if="!model"></checkPersonModal>
</template>
<script>
    import checkPersonModal from './checkPersonModal.vue'
    import { mapMutations } from 'vuex'
    export default {

      components: { checkPersonModal },
      name: "person-deploy",
      data() {
        return {
          active:'1',
          formData:{},//隐患详情
          id:this.$route.params.id,
          MeasuresDetails:[],//措施详情
          approvalPerson:[{
            name:'',
            id:'',
          }],//审批人
          userDetail: JSON.parse(localStorage.getItem('userDetail')),
          approvalPerson2:{},
          checkType:'',
          index:'',
          personType:'',
          model:true
        }
      },
      methods: {
        ...mapMutations(['closeTag']),
        closetab() {
          /**
           * 如果是调用closeTag方法，普通的页面传入的对象参数只需要写name字段即可
           * 如果是动态路由和带参路由，需要传入query或params字段，用来区别关闭的是参数为多少的页面
           */
          this.closeTag({
            name: 'deploy-person',
            params: {
              type: this.$route.params.type,
              name: this.$route.params.name,
            }
          })
        },

        addPerson() {
          if(this.approvalPerson.length>2){
            this.$Message.warning('最多添加三个审核人');
            return;
          }
          this.approvalPerson.push({
            name:'',
            id:'',
          })
        },
        checkPerson(index,type){
          this.index = index;
          this.checkType = type;
          this.model = false;
        },
        getMsg(data){
          if(data == 0){
            this.model = true;
          }else{
            if(this.checkType == 1){
              let addType = true;
              this.approvalPerson.forEach(item=>{
                if(item.id == data.personUserOrgId){
                  addType = false;
                }
              })
              if(addType){
                this.approvalPerson[this.index] = {
                  name:data.name,
                  id:data.personUserOrgId
                }
              }
            }else{
              this.approvalPerson2 = {
                name:data.name,
                id:data.personUserOrgId
              }
            }
            this.model = true;
          }
        },
        remove(row) {
          this.approvalPerson.splice(row, 1)
        },
        getAppConfig(){
          this.$api.measurePlan.getApprovalConfig().then(res => {
            if (res.code == 200) {
              if(res.data.approvalType1.length>0){
                this.approvalPerson = [];
                res.data.approvalType1.forEach(item=>{
                  this.approvalPerson.push({
                    name:item.userName,
                    id:item.personUserOrgId
                  })
                })
              }
              if(res.data.approvalType2){
                this.approvalPerson2 = {
                  name:res.data.approvalType2.userName,
                  id:res.data.approvalType2.personUserOrgId
                };
              }
            } else {
              this.$Message.error('保存失败')
            }
          })
        },
        saveSubmit(){
          let ids1 = [];
          if(!this.approvalPerson[0].id){
            this.$Message.warning('审批人不能为空');
            return;
          }
          if(!this.approvalPerson2.id){
            this.$Message.warning('签发人不能为空');
            return;
          }
          this.approvalPerson.forEach(item=>{
            ids1.push(item.id);
          })
          let data = {
            approvalType1PersonUserOrgIdList:ids1,
            approvalType2PersonUserOrgId:this.approvalPerson2.id,
            functionType:1,
            organizationTypeId:this.personType,
            projectTeamId:this.userDetail.projectTeamId,
            rootOrganizationId:this.userDetail.enterpriseId
          }
          this.$api.measurePlan.saveApprovalConfig(data).then(res => {
            if (res.code == 200) {
              this.closetab();
              this.$Message.success('保存成功')
            } else {
              this.$Message.error('保存失败')
            }
          })
        }
      },
      mounted () {
        if (this.userDetail.userInOrgType == 'PROJECT_TEAM_USER') {
          this.personType = 3;
        }else if(this.userDetail.userInOrgType == 'ROOT_ENTERPRISE_USER'){
          this.personType = 1;
        }else if(this.userDetail.userInOrgType == 'NOMAL_ENTERPRISE_USER'){
          this.personType = 2;
        }
        this.getAppConfig();
      }
    }
</script>

<style scoped>

</style>